<!DOCTYPE html>
<html>

	<head>
		<title>我的消息</title>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
		<link rel="stylesheet" href="/js/bootstrap/css/bootstrap.min.css">
		<script src="/js/jquery/jquery.min.js"></script>
		<script src="/js/bootstrap/js/bootstrap.bundle.min.js"></script>
		<link rel="stylesheet" href="/css/font/css/font-awesome.min.css" />
		<link rel="stylesheet" href="/css/reset.css" />
		<link rel="stylesheet" href="/css/message.css" />
		<script src="../js/plugins/jrender/jrender.min.js"></script>

		<script>
			$(function () {
			    var html = "";
                var user = JSON.parse(sessionStorage.getItem('user'));
                /*----------------------------------------------系统通知---------------------------------------------------*/
                    $.get("/systemMessages/" + 0 ,function (data) {
                        var num = 0;
                        $.each(data,function (index, item) {
                            if (user.id == item.user.id){

                                html += "<dd>" +
                                    "尊敬的 <a href='javascrip:;' style='color: #FF5722' data-systemmessageid='"+item.id+"' id='systemmessage'>"+item.user.nickName+"</a> 用户,您好:" +
                                    "<p>您发布的《"+item.travel.title+"》"+item.content+"</p>" +
                                    "<p style='text-align: right'>"+item.systemtime+"</p>" +
                                    "<a href='/travelContent.html?id="+item.travel.id+"' style='color: #ffd350' >点击查看详情</a>"
                                "</dd>";
                                num += 1;
                            }
                            $("#system .badge-pill").html(num);
                        });

                    });

					$(".align-items-center").click(function () {
						$("#systemmsg").remove();
						$(".itemList").html(html);
                        var systemMessageId = $("#systemmessage").data("systemmessageid");
                        $.ajax({
                            type: "put",
                            url: "/systemMessages",
                            data: {state:1,systemMessageId:systemMessageId},
                            success: function(msg){

                            }
                        });
					});
				/*------------------------------------------系统通知end------------------------------------------------------*/

				/*------------------------------------------私信-------------------------------------------------------*/

                var targetId = user.id;
                var personHtml = '';
                var personnum = 0;
                $.get("/personMessage",{targetId:targetId,state:0},function (data) {
                    $.each(data,function (index, item) {
                        personHtml += '<dd>' +
                            '<img src="'+item.coverUrl+'" style="width: 50px">' +
                            '来自 '+'<span class="sourceuser" style="color: #00bbd3">'+item.sourceUser.nickName+'</span>' + ' 的私信:' +
                            '<span >'+item.content+'</span>' +
                            '<p>时间: <span style="text-align: right">'+item.time+'</span>' +
                            '</p>' +
                            '</dd>' +
							'<hr>';
                        personnum += 1;
                        $("#personMessage .badge-pill").html(personnum);
                    });

                });

				var detach = $("#personMsg").detach();
                $("#personMessage").click(function () {

                    if(personnum != 0){
                        $("#personMessage").append(detach);
					}
                    $("#personnum").remove();
                    $(".personList").html(personHtml);

                    $.ajax({
                        type: "put",
                        url: "/personMessage",
                        data: {state:1,targetId:targetId},
                        success: function(msg){

                        }
                    });
                });


				/*------------------------------------------私信end-------------------------------------------------------*/
				/*------------------------------------------@我的-------------------------------------------------------*/

                var sendmeHtml = '';
                var sendmenum = 0;
                $.get("/sendMe",{targetId:targetId,state:0},function (data) {
                    $.each(data,function (index, item) {
                        sendmeHtml += '<dd>' +
                            '<span class="sourceuser" style="color: #00bbd3">'+item.nickName+'</span>' + ' @了我: ' +
                            '<span >'+item.content+'</span>' +
                            '<p>时间: <span style="text-align: right">'+item.createTime+'</span>' +
                            '</p>' +
                            '</dd>' +
							'<hr>';
                        sendmenum += 1;
                        $("#sendmeMessage .badge-pill").html(sendmenum);
                    });

                });

                var sendmedetach = $("#sendmeMsg").detach();
                $("#sendmeMessage").click(function () {
                    if(sendmenum != 0){
                        $("#sendmeMessage").append(sendmedetach);
                    }
                    $("#sendmenum").remove();
                    $(".sendmeList").html(sendmeHtml);

                    $.ajax({
                        type: "put",
                        url: "/sendMe",
                        data: {state:1,targetId:targetId},
                        success: function(msg){

                        }
                    });
                });

                /*------------------------------------------@我的end-------------------------------------------------------*/
                /*------------------------------------------点赞-------------------------------------------------------*/
                var travelLikeHtml = '';
                var travelLikenum = 0;
                $.get("/travelLikes/interest",{type:0,targetId:targetId},function (data) {
                    //console.log(data);
                    $.each(data,function (index, item) {
                        travelLikeHtml += '<dd>' +
                            '<span class="sourceuser" style="color: #00bbd3">'+item.user.nickName+'</span>' +
                            '在《<span >'+item.travel.title+'</span>》游记中赞了你   ' +
                            '<p>时间: <span style="text-align: right">'+item.time+'</span>' +
                            '</p>' +
                            '</dd>';
                        travelLikenum += 1;
                        $("#travelLikeMessage .badge-pill").html(travelLikenum);
                    });

                });

                var travelLikedetach = $("#travelLikeMsg").detach();
                $("#travelLikeMessage").click(function () {
                    if(travelLikenum != 0){
                        $("#travelLikeMessage").append(travelLikedetach);
                    }
                    $("#travelLikenum").remove();
                    $(".travelLikeList").html(travelLikeHtml);

                    $.ajax({
                        type: "put",
                        url: "/travelLikes",
                        data: {type:1,targetId:targetId},
                        success: function(msg){

                        }
                    });
                });


                /*------------------------------------------点赞end-------------------------------------------------------*/
                /*------------------------------------------评论-------------------------------------------------------*/

                var travelDiscussHtml = '';
                var travelDiscussnum = 0;
                $.get("/travelDiscusses/" + targetId,{type:0}, function (data) {
                    //console.log(data);
                    $.each(data,function (index, item) {
                        console.log(item);
                        travelDiscussHtml += '<dd>' +
                            '<img src="'+item.source.headImgUrl+'" style="width: 30px" class="rounded-circle">' +
                            '<span class="sourceuser" style="color: #00bbd3">'+item.source.nickName+'</span>' +
                            '在《<span >'+item.travel.title+'</span>》游记中评论: <br>' +
                            '<span>'+item.content+'</span>' +
                            '<p style="text-align: right"><span>'+item.time+'</span>' +
                            '</p>' +
                            '<a href= "/pinglun.html?id='+item.travel.id+'" style="color: #ffd350" >点击查看详情</a>' +
                            '</dd>';
                        travelDiscussnum += 1;
                        $("#travelDiscussMessage .badge-pill").html(travelDiscussnum);
                    });

                });

                var travelDiscussdetach = $("#travelDiscussMsg").detach();
                $("#travelDiscussMessage").click(function () {
                    if(travelDiscussnum != 0){
                        $("#travelDiscussMessage").append(travelDiscussdetach);
                    }
                    $("#travelDiscussnum").remove();
                    $(".travelDiscussList").html(travelDiscussHtml);

                    $.ajax({
                        type: "put",
                        url: "/travelDiscusses",
                        data: {type:1},
                        success: function(msg){

                        }
                    });
                });

                /*------------------------------------------评论end-------------------------------------------------------*/
            })
		</script>

	</head>

	<body>
		<div class="search-head">
			<div class="row nav-search">
				<div class="col">
					<a href="javascript:history.go(-1);">
						<span><i class="fa fa-chevron-left" ></i></span>
					</a>
				</div>
				<div class="col">
					<span>我的消息</span>
				</div>
				<div class="col"></div>
			</div>
		</div>

		<ul class="list-group">
			<a href="javascrip:;" id="travelLikeMessage" data-toggle="collapse" data-target="#travelLikeMsg" >
				<li class="list-group-item d-flex justify-content-between align-items-center">
					<div class="item">
						<span><i class="fa fa-thumbs-o-up"></i></i></span>
						<span>	点赞</span>
						<span class="badge badge-danger badge-pill" id="travelLikenum"></span>
					</div>
					<i class="fa fa-chevron-right"></i>
				</li>
			</a>
			<div class="container travelLikeMsg" id="travelLikeMsg"  >
				<dl class="travelLikeList" >

				</dl>
			</div>


            <a href="javascrip:;" id="sendmeMessage" data-toggle="collapse" data-target="#sendmeMsg" >
                <li class="list-group-item d-flex justify-content-between align-items-center">
                    <div class="item">
                        <span><i class="fa fa-at"></i></i></span>
                        <span>	@我的</span>
                        <span class="badge badge-danger badge-pill" id="sendmenum"></span>
                    </div>
                    <i class="fa fa-chevron-right"></i>
                </li>
            </a>
            <div class="container sendmeMsg" id="sendmeMsg"  >
                <dl class="sendmeList" >

                </dl>
            </div>


			<a href="javascrip:;" id="travelDiscussMessage" data-toggle="collapse" data-target="#travelDiscussMsg" >
				<li class="list-group-item d-flex justify-content-between align-items-center">
					<div class="item">
						<span><i class="fa fa-commenting-o" ></i></span>
						<span>评论</span>
						<span class="badge badge-danger badge-pill" id="travelDiscussnum"></span>
					</div>
					<i class="fa fa-chevron-right"></i>
				</li>
			</a>
            <div class="container travelDiscussMsg" id="travelDiscussMsg"  >
                <dl class="travelDiscussList" >

                </dl>
            </div>

			<a href="javascrip:;" id="personMessage" data-toggle="collapse" data-target="#personMsg" >
				<li class="list-group-item d-flex justify-content-between align-items-center">
					<div class="item">
						<span><i class="fa fa-envelope-o" ></i></span>
						<span>	私信</span>
						<span class="badge badge-danger badge-pill" id="personnum"></span>
					</div>
					<i class="fa fa-chevron-right"></i>
				</li>
			</a>
			<div class="container personMsg" id="personMsg"  >
				<dl class="personList" >

				</dl>
			</div>


			<a href="javascrip:;" id="system" data-toggle="collapse" data-target="#systemMgr" >
				<li class="list-group-item d-flex justify-content-between align-items-center">
					<div class="item">
						<span><i class="fa fa-bell" ></i></span>
						<span>系统通知</span>
						<span class="badge badge-danger badge-pill" id="systemmsg"></span>
					</div>
					<i class="fa fa-chevron-right"></i>
				</li>
			</a>
				<div class="container systemMsg" id="systemMgr">
					<dl class="itemList">


					</dl>
				</div>
		</ul>



	</body>

</html>